<template tag="以下文档内容为hycli自动生成">
  <div style="height: 100%">
    <div style="margin:0.8rem;"><h5 style="display:inline">业务系统</h5><span style="margin-left: 0.5rem; color:#999"> 管理各业务线的平台、系统、应用</span>
    </div>
    <hr style="margin-top:0;color:#999"/>
<div class="query">
    
    <el-form :model="form_aabcg" inline >
        <!-- 日期控件个数： 0 -->
        <!--父部 下拉控件 -->
        <el-form-item>
            <el-select  v-model="form_aabcg.parent_id" style="width: 100px" filterable clearable placeholder="父部">
                <el-option v-for="item in parent_idList" :key="item.value" :label="item.name" :value="item.value" />
            </el-select>
        </el-form-item>
        <!--状态 下拉控件 -->
        <el-form-item>
            <el-select  v-model="form_aabcg.status" style="width: 100px" filterable clearable placeholder="状态">
                <el-option v-for="item in statusList" :key="item.value" :label="item.name" :value="item.value" />
            </el-select>
        </el-form-item>
        <!--业务线 下拉控件 -->
        <el-form-item>
            <el-select  v-model="form_aabcg.lob_id" style="width: 100px" filterable clearable placeholder="业务线">
                <el-option v-for="item in lob_idList" :key="item.value" :label="item.name" :value="item.value" />
            </el-select>
        </el-form-item>
        <!-- 控件个数：[{"index":34,"raw":"name","name":"name","cname":"Name","type":{"raw":"varchar(32)","name":"varchar","len":32,"dlen":0},"defValue":"","allowNull":false,"constraints":["l","le","c","u","q","v","DN","#like"],"desc":{"raw":"名称","name":"名称"}} {"index":40,"raw":"memo","name":"memo","cname":"Memo","type":{"raw":"varchar2(64)","name":"varchar2","len":64,"dlen":0},"defValue":"","allowNull":true,"constraints":["l","le","c","u","q","v","#like"],"desc":{"raw":"备注","name":"备注"}}] -->
         <el-form-item>
            <el-input clearable style="width: 180px" v-model="form_aabcg.single_text_value" maxlength="32"
                placeholder="关键字" >
                <template #prepend>
                    <el-select v-model="form_aabcg.single_text_name" placeholder="查询类型" style="width:84px;">
                        <el-option
                        v-for="item in multiQueryText"
                        :key="item.value"
                        :label="item.label"
                        :value="item.value"
                      />
                      </el-select>
                  </template>
            </el-input>
        </el-form-item>

        <span class="ddl">
        </span>
        <el-form-item>
            <el-space wrap>
                <el-button type="primary" icon="Search" @click="onQuery(true)">查询数据</el-button>
                <el-button :type="$js.page.tagColor(0)"  icon="Plus"  @click="show_cmpnt_aabcm">添加平台</el-button>
            </el-space>
        </el-form-item>
        

        <!-- xtabs -->
        

    </el-form>
</div>
<div>
   <aabcm ref="cmpnt_aabcm" @onsaved="onQuery"></aabcm>
   <aabch ref="cmpnt_aabch" @onsaved="onQuery"></aabch>
   <aabci ref="cmpnt_aabci" @onsaved="onQuery"></aabci>
   <aabcj ref="cmpnt_aabcj" @onsaved="onQuery"></aabcj>
   <aabck ref="cmpnt_aabck" @onsaved="onQuery"></aabck>
   <aabcl ref="cmpnt_aabcl" @onsaved="onQuery"></aabcl>
</div>
<div class="list">
    <el-table :data="dataList_aabcg" row-key="id" 
    
    v-loading="conf.loading" stripe  style="width: 100%;height:calc(100vh - 160px)"
         empty-text="无数据">le
        
        	<!--id text -->
        <el-table-column  show-overflow-tooltip    align="center" label="编号" >
            <template #default="scope">
                  <span>{{ scope.row.id||'-' }}</span>
              </template>
        </el-table-column>
        	<!--name text -->
        <el-table-column  show-overflow-tooltip    align="center" label="名称" >
            <template #default="scope">
                  <span>{{ scope.row.name||'-' }}</span>
              </template>
        </el-table-column>
        	<!--level select -->
        <el-table-column     prop="level" align="center" label="系统层级">
            <template #default="scope">
                <span :class="$js.page.colorful(scope.row.level,'level')" 
                    v-text="scope.row.level_label"></span>
            </template>
        </el-table-column>
        	<!--status switch -->
        <el-table-column     align="center" label="状态">
            <template #default="scope">
                <el-switch  @change="onstatusSwitchChange(scope.row,$event)"  v-model="scope.row.status_switch" />
            </template>
        </el-table-column>
        	<!--create_time text -->
        <el-table-column  show-overflow-tooltip    align="center" label="创建时间" >
            <template #default="scope">
                  <span>{{ scope.row.create_time||'-' }}</span>
              </template>
        </el-table-column>
        	<!--memo text -->
        <el-table-column  show-overflow-tooltip    align="center" label="备注" >
            <template #default="scope">
                  <span>{{ scope.row.memo||'-' }}</span>
              </template>
        </el-table-column>

<el-table-column fixed="right" align="center" label="操作" width="180">
    <template #default="scope">
        <div class="opts">
            <el-button   type="text" @click="show_cmpnt_aabch(scope.row)"  v-if='
            scope.row.level==1'>添加系统 </el-button>
            <el-button   type="text" @click="show_cmpnt_aabci(scope.row)"  v-if='
            scope.row.level==2'>添加应用 </el-button>
            <el-dropdown  @command="(command) => show_cmpnt(command, scope.row)">
                <span class="el-dropdown-link">
                更多
                </span>
                <template #dropdown>
                  <el-dropdown-menu>
            <el-dropdown-item command="aabcj" >详情 </el-dropdown-item>
            <el-dropdown-item command="aabck" >修改 </el-dropdown-item>
            <el-dropdown-item command="aabcl" >删除 </el-dropdown-item>
                </el-dropdown-menu>
            </template>
            </el-dropdown>
        </div>
    </template>
</el-table-column>
    </el-table>
    <el-pagination :currentPage="form_aabcg.pi" :page-size="form_aabcg.ps"
        style="position: absolute; right: 30px;bottom:6px;" :page-sizes="[10,15,20,30, 50, 100]" :background="false" small
        layout="total,sizes,prev, pager, next, jumper" :total="total_aabcg" @size-change="handleSizeChange"
        @current-change="handleCurrentChange" />
</div>
  </div>
</template>
<script>
// 添加平台
import aabcm from "@/views/ws/olb/olb_system.add"
// 添加系统
import aabch from "@/views/ws/olb/olb_system.add"
// 添加应用
import aabci from "@/views/ws/olb/olb_system.add"
// 详情
import aabcj from "@/views/ws/olb/olb_system.view"
// 修改
import aabck from "@/views/ws/olb/olb_system.edit"
// 删除
import aabcl from "@/views/ws/olb/olb_system.cnfrm"



export default {
components: {
    aabcm,
    aabch,
    aabci,
    aabcj,
    aabck,
    aabcl,
},
data() {
  return {
    shortcuts: this.$js.page.latestDays(),
    cmpnt_funcs:{},
    conf: {
      loading: false,
      progressColor: this.$theia.env.conf.progress || []
    },
    ganttIdx: -1,
        form_aabcg: {
            pi: 1,
            ps: 15,
            disabled:false,
            single_date_range_name:"",
            single_date_range_value:[],
            single_text_name:"",
            single_text_value:"",
            name:"",
            parent_id:"",
            status:"",
            lob_id:"",
            memo:"",
            },
            parent_idList:[],
            levelList:[],
            statusList:[],
            lob_idList:[],
            dataList_aabcg:[],
            multiQueryDateRange:[],
            multiQueryText:[{label:"名称",value:"name"},{label:"备注",value:"memo"},],
            total_aabcg:0,
            note_dataList:[],
};
  },
mounted() {
  this.loadEnums_aabcg()
  this.form_aabcg.single_date_range_name = (this.multiQueryDateRange[0]||{}).value
  this.form_aabcg.single_text_name = (this.multiQueryText[0]||{}).value
  this.cmpnt_funcs["aabcm"] = this.show_cmpnt_aabcm
  this.cmpnt_funcs["aabch"] = this.show_cmpnt_aabch
  this.cmpnt_funcs["aabci"] = this.show_cmpnt_aabci
  this.cmpnt_funcs["aabcj"] = this.show_cmpnt_aabcj
  this.cmpnt_funcs["aabck"] = this.show_cmpnt_aabck
  this.cmpnt_funcs["aabcl"] = this.show_cmpnt_aabcl

  this.form_aabcg = Object.assign(this.form_aabcg,this.$route.params)
  this.queryData_aabcg ()
    },
methods: {
  ganttChange(id) {
      this.ganttIdx = id
    },

queryData_aabcg(mform = {},nform={}){
    //构建查询参数
    let queryForm = Object.assign({},this.form_aabcg)
    queryForm = Object.assign(queryForm,nform||{})
    
    //处理多个日期选择
    queryForm[this.form_aabcg.single_date_range_name] = this.form_aabcg.single_date_range_value
    queryForm[this.form_aabcg.single_text_name] = this.form_aabcg.single_text_value
   
    //处理日期范围选择

    queryForm[this.form_aabcg.single_date_range_name] = null
    queryForm.single_date_range_value = null
    queryForm.single_date_range_name = null

    queryForm.single_text_value = null
    queryForm.single_text_name = null
 
    //处理关联表olb_system olb_system olb_system
        queryForm.id = mform.parent_id
   
    //发送查询请求
    let that = this
    that.conf.loading = true
    //构建统计查询
  //数据查询
  this.$theia.http.get("/ws/olb/system/query",queryForm).then(res=>{
      if((res.items||[]).length < (queryForm.ps||10)){
        that.form_aabcg.disabled = true
      }
      that.conf.loading = false
      that.dataList_aabcg = res.items||[]
      that.total_aabcg = res.count
      that.resetItemData_aabcg(that,that.dataList_aabcg)
    });
  },

  resetItemData_aabcg(that,lst){
    lst.forEach(item => {
      item.__raw = Object.assign({}, item)
    item.parent_id_label = that.$theia.enum.getName("olb_system",item.parent_id)
    item.level_label = that.$theia.enum.getName("os_level",item.level)
    item.status_label = that.$theia.enum.getName("status",item.status)
    item.lob_id_label = that.$theia.enum.getName("my_business_line",item.lob_id)
    item.id_progress = item.id
    item.name_progress = item.name
    item.parent_id_progress = item.parent_id
    item.level_progress = item.level
    item.status_switch = item.status == 0
    item.create_time_progress = item.create_time
    item.lob_id_progress = item.lob_id
    item.memo_progress = item.memo
    item.le_id = item.id
    item.le_name = item.name
    item.le_parent_id = item.parent_id
    item.le_level = item.level
    item.le_status = item.status
    item.le_create_time = item.create_time
    item.le_lob_id = item.lob_id
    item.le_memo = item.memo
    if(item.children){
      that.resetItemData_aabcg(that,item.children)
    }
  });
  },
  onstatusSwitchChange(xfrom,v) {
      let form = {}
      form.status = v == true? 0 : 1;
      form.id = xfrom.id
      let that = this
      this.$theia.http.post("/ws/olb/system/switch",form).then(res=>{
        that.$notify.success({title: '成功',message: '修改状态成功',duration:5000})
      }).catch(res=>{
        v = !v
        let code = ((res||{}).response||{}).status||0
        let msg = `修改状态失败(${code})`
        that.$notify.error({title: '失败',message: msg,duration:5000})
      });
  },
    loadEnums_aabcg(){
        //父部
        this.parent_idList = this.$theia.enum.get("olb_system","","" ,false,"")
        //状态
        this.statusList = this.$theia.enum.get("status","","" ,false,"")
        //业务线
        this.lob_idList = this.$theia.enum.get("my_business_line","","" ,false,"")
        //系统层级
        this.levelList = this.$theia.enum.get("os_level","","" ,false,"")
        //状态
        this.statusList = this.$theia.enum.get("status","","" ,false,"")
    },

  handleSizeChange(ps){
    this.form_aabcg.ps = ps
    this.onQuery(true)
  },
  handleCurrentChange(pi){
    this.form_aabcg.pi = pi
    this.onQuery()
  },
  onQuery(refresh){
    if(refresh){
      this.form_aabcg.pi = 1
    }
    this.queryData_aabcg ()
  },
show_cmpnt(cmd,row){
  if(this.cmpnt_funcs[cmd]){
    this.cmpnt_funcs[cmd](row)
  }
},
  //添加系统
  show_cmpnt_aabch(fm = {}){
    let query = {} 
    query.name = fm.name|| fm.le_name 
    query.status = fm.status|| fm.le_status 
    query.memo = fm.memo|| fm.le_memo 
    query.id = fm.id

      //2023.4.18添加---
    query.level = "2"
    query.name = ""
    query.parent_id = fm.id
    query.status = "0"

    query.$title="添加系统"
    this.$refs.cmpnt_aabch.show(query)
  },
  //添加应用
  show_cmpnt_aabci(fm = {}){
    let query = {} 
    query.name = fm.name|| fm.le_name 
    query.status = fm.status|| fm.le_status 
    query.memo = fm.memo|| fm.le_memo 
    query.id = fm.id

      //2023.4.18添加---
    query.level = "3"
    query.name = ""
    query.parent_id = fm.id
    query.status = "0"

    query.$title="添加应用"
    this.$refs.cmpnt_aabci.show(query)
  },
  //详情
  show_cmpnt_aabcj(fm = {}){
    let query = {} 
    query.id = fm.id|| fm.le_id 
    query.name = fm.name|| fm.le_name 
    query.create_time = fm.create_time|| fm.le_create_time 
    query.lob_id = fm.lob_id|| fm.le_lob_id 
    query.memo = fm.memo|| fm.le_memo 
    query.id = fm.id

      //2023.4.18添加---

    query.$title="详情"
    this.$refs.cmpnt_aabcj.show(query)
  },
  //添加平台
  show_cmpnt_aabcm(fm = {}){
    let query = {} 
    query.name = fm.name|| fm.le_name 
    query.status = fm.status|| fm.le_status 
    query.memo = fm.memo|| fm.le_memo 
    query.id = fm.id

      //2023.4.18添加---
    query.level = "1"
    query.status = "0"

    query.$title="添加平台"
    this.$refs.cmpnt_aabcm.show(query)
  },
  //修改
  show_cmpnt_aabck(fm = {}){
    let query = {} 
    query.name = fm.name|| fm.le_name 
    query.level = fm.level|| fm.le_level 
    query.status = fm.status|| fm.le_status 
    query.memo = fm.memo|| fm.le_memo 
    query.id = fm.id

      //2023.4.18添加---

    query.$title="修改"
    this.$refs.cmpnt_aabck.show(query)
  },
  //删除
  show_cmpnt_aabcl(fm = {}){
    let query = {} 
    query.id = fm.id|| fm.le_id 
    query.id = fm.id

      //2023.4.18添加---

    query.$title="删除"
    this.$refs.cmpnt_aabcl.show_aabcl(query)
  },
},
};
</script>
<style>
.el-dialog{
  border-radius:5px !important
}
</style>
<style scoped>
.el-form-item {
  margin-right: 10px !important;
}

.opts .el-button--small {
  margin-left: 0px;
  padding-left: 0px;
  margin-right: 4px;
}

/deep/.el-table td.el-table__cell div {
  vertical-align: middle;
}
/deep/.el-button+.el-dropdown{
  margin-left:0px;
}
/deep/.el-button+.el-button{
  margin-left:0px;
}
.el-button{
  padding-left: 6px !important;
  padding-right: 6px !important;
}
.blist {
  margin-bottom: 8px;
  width: 100%;
}

.blist .el-radio-group {
  margin-right: 8px;
}

.ddl {
  margin-bottom: 8px;
  width: 100%;

}

.ddl .el-dropdown {
  margin-right: 8px;
}

.listbar {
  margin-bottom: 8px;
  text-align: center;
}
 .el-dropdown-link {
  cursor: pointer;
  color: var(--el-color-primary);
  display: flex;
  align-items: center;
  font-size: 0.65rem;
}
/deep/.el-button--small{
  padding: 5px 4px;
}

.prepend /deep/.el-input__wrapper{
  border-top-right-radius:0;
  border-bottom-right-radius:0;
}
.prepend+/deep/.el-date-editor{
  border-top-left-radius:0;
  border-bottom-left-radius:0;
  border-left:0;
}

</style>